<template>
    <div class="chat-main-container">
        <TmallNavBar>
            <template #default>socket.io聊天</template>
        </TmallNavBar>

        <div class="btn-wrap">
            <van-button @click="goto('/phpSocketIo')">php socket.io聊天</van-button>
            <van-button @click="goto('/golangSocketIo')">golang socket.io聊天</van-button>
            <van-button @click="goto('/nodeSocketIo')">nodejs socket.io聊天</van-button>
            <van-button @click="goto('/golangWebsocket')">golang websocket聊天</van-button>
            <van-button @click="goto('/phpWebsocket')">php websocket聊天</van-button>
        </div>
    </div>
</template>

<script lang="ts" setup>
import { useRouter } from 'vue-router';


// 路由器
const router = useRouter() 
const goto = (url: string) => {
    router.push({path: url})
}
</script>

<style scoped lang="scss">
.chat-main-container {
    padding: 50px 10px 0 10px;
    .btn-wrap {
        display: flex;
        justify-content: space-around;
        flex-wrap: wrap;
    }
}
</style>